<template>
	<view class="container">
		<view class="explain-text">长按设备按钮5秒, 等指示灯闪烁</view>
		<view class="explain-text">跳转到系统设置>无线局域网页面等待10秒左右点击WIFI名称为KUN GUARD进行连接</view>
		<image class="explain-img" src="@/static/wifi-config-device.png" />
		<view class="btn" @click="toConnectWifi">去链接</view>
		<view class="line"></view>
		<view class="btn" @click="toConfigWifi">去配置</view>
	</view>
</template>

<script>
	import BaseButton from "@/components/base-button/index.vue";
	import {
		showInfo
	} from "@/utils/ToastUtils.js";

	export default {
		data() {
			return {
				// wifi状态
				isWifi: false,
				wifiInfo: {},
			};
		},
		components: {
			BaseButton,
		},
		onLoad(options) {
			uni.startWifi({
				success: () => {
					console.log("wifi初始化成功");
				},
				fail: (err) => {
					console.log("wifi初始化失败", err);
				}
			})
		},
		methods: {
			toConnectWifi() {
				uni.connectWifi({
					SSID: "KUN GUARD",
					password: "123456",
					maunal: true,
					partialInfo: true,
					forceNewApi: true,
					success: (res) => {
						console.log("connectWifi success", res);
					},
					fail: (err) => {
						console.log("connectWifi error", err);
					}
				})
			},
			toConfigWifi() {
				uni.getConnectedWifi({
					partialInfo: true,
					success: (res) => {
						console.log("getConnectedWifi success", res);
						if(res.wifi.SSID != "KUN GUARD") {
							showInfo("请连接KUN GUARD该WIFI");
							return;
						}
						uni.navigateTo({
							url: '/pages/addDevice/configWifiForm'
						})
					},
					fail: (err) => {
						console.log("getConnectedWifi error", err);
					}
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	.container {
		height: 100vh;
		background-color: #FFFFFF;
		padding-top: 54rpx;

		.explain-text {
			width: 650rpx;
			font-size: 30rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #6c6c6c;
			padding: 20rpx 0;
			margin: 0 auto;
			text-align: center;
		}

		.explain-img {
			width: 660rpx;
			height: 700rpx;
			display: block;
			margin: 76rpx auto;
		}

		.line {
			height: 30rpx;
		}

		.btn {
			width: 655rpx;
			height: 85rpx;
			border-radius: 50rpx;
			margin: 0 auto;
			background: linear-gradient(to right, #24f37c, #19bc62);
			display: flex;
			align-items: center;
			justify-content: center;
			font-size: 36rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
		}
	}
</style>